<template>
    <div>
        <el-dialog title="修改卖家信息" :visible.sync="dialogFormVisible">
            <el-form ref="sellerForm" :model="sellerTemp.member" :rules="rules">
                <el-form-item label="基本信息">
                   <!-- <span>{{seller.sellerCode}}</span>-->
                    <span>{{JSON.stringify($store.state.sellerCode)}}</span>
                </el-form-item>
                <el-form-item label="昵称" prop="nickName">
                    <el-input v-model="sellerTemp.member.nickName">
                    <!--<span slot="append">{{seller.member.nickName}}</span>-->
                    </el-input>
                </el-form-item>
                <el-form-item label="余额" prop="balance">

                    <el-input  type="number" step="0.01"
                               v-model.number="sellerTemp.member.balance"></el-input>
                </el-form-item>
                <el-form-item label="注册时间">
                   <!-- <el-date-picker value-format="yyyy-MM-dd"
                                    v-model="sellerTemp.createDate"></el-date-picker>
                    -->
                    <span>{{sellerTemp.createDate}}</span>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="reset">重 置</el-button>
                <el-button type="primary"  @click="validateSubmit">提 交</el-button>
                <slot></slot>
                <el-button type="info"  @click="dialogFormVisible=false">取 消</el-button>

            </div>
        </el-dialog>
    </div>
</template>

<script>
    import {mapState, mapMutations} from 'vuex'

    export default {
        props:[],
        data: function () {
            return {
                sellerTemp: {
                    id: 0,
                    sellerCode: '',
                    member: {
                        balance: 0.01,
                        nickName: ''
                    },
                    createDate: '2011-01-01'
                },
                dialogFormVisible: false,
                rules:{
                    balance: [
                        { required: true, message: '请输入剩余金额', trigger: 'blur' },
                        { type: 'number', message: '金额必须为数字值'}
                    ],
                    nickName: [
                        { required: true, message: '请输入昵称', trigger: 'blur' },
                        { min: 0,max: 10, message: '10个字符以内', trigger: 'blur' }
                    ],
                }

            }
        },
        computed: {
            ...mapState(['sellerCode',])
        },
        methods: {
            init: function () {
                let url = 'http://localhost:8899/seller/'+this.sellerCode;
                this.$http({
                    url:url,
                    method:'get',
                }).then(res=>{
                    this.sellerTemp =res.data;
                    this.dialogFormVisible=true;

                });

            },
         /*   ...mapMutations(['',]),*/
            validateSubmit:function () {
                this.$refs['sellerForm'].validate((valid)=>{
                    if (!valid) {
                        this.$message.warning('请重新输入符合要求的内容');
                        return false;
                    }

                    let url = 'http://localhost:8899/seller/'+this.sellerTemp.sellerCode;
                    this.$http({
                        method:'patch',
                        url:url,
                        data:this.sellerTemp.member,
                    }).then(({data}) =>{
                        console.log(JSON.stringify(data));
                        this.sellerTemp = data;
                        this.dialogFormVisible=false;
                        this.$emit('close');

                    })
                });


            },
            reset:function () {
                let url = 'http://localhost:8899/seller/'+this.sellerCode;
                this.$http({
                    url:url,
                    method:'get',
                }).then(res=>{
                    this.sellerTemp =res.data;
                });
            }




        },
        watch:{
        },

        mounted: function () {
            // this.sellerTemp=this.seller;
        },

        created: function () {

        },
        name: "SellerCore"
    }
</script>

<style scoped>

</style>
